<template>
	<view>
		<view class="">
			<scroll-view scroll-x class="bg-white nav">
				<view class="flex text-center">
					<view class="cu-item flex-sub" :class="index==TabCur?'text-blue cur':''" v-for="(item,index) in tabs" :key="index" @tap="tabSelect" :data-id="index">
						{{item.name}}
					</view>
				</view>
			</scroll-view>
		</view>
		<view class="">
			<swiper class="swiper" :style="'height:calc(100vh - '+ barHeight +'px);'" :current="TabCur" :indicator-dots="false" @change="swipChange">
				<swiper-item v-for="(item, index) in tabs" :key="index">
					<orderlist :type="index" :curTab="TabCur"></orderlist>
				</swiper-item>
			</swiper>
		</view>
	</view>
</template>

<script>
	import orderlist from "../../components/orderlist.vue";
	export default {
		data() {
			return {
				tabs: [{name: '询价中', id: 'reco'}, {name: '待出行', id: 'last'}, {name: '进行中', id: 'last'}, {name: '已完成', id: 'last'}],
				TabCur: 0,
				barHeight: 100,
				scrollLeft: 0
			}
		},
		onLoad(options) {
			this.barHeight = this.StatusBar + 100;
		},
		onShow() {
		},
		components: {
			orderlist
		},
		methods: {
			// 获取类别
			getTypes(){
				let types = this.tabs;
				let self = this;
				this.baseRequest('api/api/form/', 'GET', {}, (data)=>{
					if (data) {
						data.map(item => {
							types.push({name: item.formName.substring(0, 2), id: String(item.formID)});
							self.tabs = types;
							
							uni.setStorageSync('content_types', types);
						});
					} 
				});
			},
			navTo: function(page){
				uni.navigateTo({
					url: page
				})
			},
			tabSelect(e) {
				this.TabCur = e.currentTarget.dataset.id;
				this.scrollLeft = (e.currentTarget.dataset.id - 1) * 60
			},
			// 滑动 change
			swipChange(e){
				this.TabCur = e.detail.current;
				this.scrollLeft = (e.detail.current - 1) * 60
			}
		}
	}
</script>

<style>
</style>
